import React from 'react'
import { useEffect } from 'react'
import { useState } from 'react'
import request from './request'
export default function App() {
    let [loading, setLoading] = useState(false)
    let [repo, setRepo] = useState({})
    useEffect(()=>{
        async function getRepo(){
            // 开启loading
            setLoading(true)
            let repo = await request.get('/search/repositories',{
                params:{
                    q:'vue',
                    sort:'stars'
                }
            })
            setRepo({
                name:repo.items[0].name,
                html_url: repo.items[0].html_url
            })
            // 关闭loading
            setLoading(false)
        }
        getRepo()
    },[])
    return (
        <>
            {loading ? <h1>loading.....</h1> : (
                <div>
                    most star repo is <a href={repo.html_url}>{repo.name}</a>
                </div>
            )}
        </>
    )
}
